/**
 * Created by liguangsong on 16/8/4.
 */
import React from 'react'
import { connect } from 'react-redux'


var TitleView = React.createClass({
    render() {
        const { westTop, eastTop, westFont, eastFont } = this.props;
        //console.log(westTop);
        return (
            <div className="titleView" style={{background: 'rgb(80, 164, 70)'}}>
                <p className='regionStyle' onClick={this.selectWest} style={{top: westTop, fontSize: westFont}}>WESTERN</p>
                <p className='conferenceStyle'>conference</p>
                <p className='regionStyle' style={{left: 670,width: 0, top: eastTop, fontSize: eastFont}} onClick={this.selectEast}>EASTERN</p>
            </div>
        )
    },

    selectEast(event) {
        //console.log('east');
        this.props.selectConference("east");
    },
    selectWest(event) {
        //console.log('west');
        this.props.selectConference("west");
    }
});

function select(state) {
    return {
        westTop: state.selectConference.westTop,
        eastTop: state.selectConference.eastTop,
        westFont: state.selectConference.westFont,
        eastFont: state.selectConference.eastFont
    }
}

export default connect(select)(TitleView);